<template>

  <div>
    <el-table :data="tableData" border stripe @row-dblclick="handleRowDbClick">
      <el-table-column type="index" label="#" />
      <el-table-column prop="processDefinitionName" label="流程类型" width="200" />
      <el-table-column prop="startUser.name" label="发起人" />
      <el-table-column prop="startTime" label="提交时间" :formatter="formatTime" />
      <el-table-column prop="endTime" label="结束时间" :formatter="formatTime" />
      <el-table-column prop="currentActivityName" label="当前节点" />
      <el-table-column prop="businessStatus" label="审批状态" :formatter="formatBusinessStatus" />
      <el-table-column prop="duration" label="已耗时"  />
      <el-table-column  label="操作" >
        <template  slot-scope="scope">
          <el-button type="primary"  @click="handleRowDbClick(scope.row)">处理</el-button>
          <el-button type="primary"  @click="onDeleteProcessInstance(scope.row)">删除</el-button>
        </template>
      </el-table-column>

    </el-table>


    <el-pagination layout="prev, pager, next, total" :current-page.sync="pageNo" @current-change="getSubmitedTaskList" :total="total" />
  </div>
</template>
<script>
import { submitedTaskList,deleteProcessInstance } from "@/api/design"
import { formatTime, formatBusinessStatus } from '../form'

export default {
  data() {
    return {
      tableData: [],
      total: 0,
      pageNo: 1,
      pageSize: 50,
    }
  },
  methods: {

      onDeleteProcessInstance(row) {
              this.$confirm('删除后将失去该流程实例所有数据且无法恢复，是否继续 ?', '警告', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
              }).then((res) => {
        deleteProcessInstance(row.processInstanceId).then((res) => {
          console.log("同意res", res);
        });
        })
      },


    getSubmitedTaskList() {
      const str = sessionStorage.getItem("user")
      const currentUserInfo = JSON.parse(str)
      currentUserInfo.id = currentUserInfo.id.toString()

      submitedTaskList({
        currentUserInfo,
        pageNo: this.pageNo,
        pageSize: this.pageSize,
      }).then(rsp => {
        this.tableData = rsp.data.result.records
        this.total = rsp.data.result.total
      })
    },
    formatTime, formatBusinessStatus,
    handleRowDbClick(row) {

      this.$router.push({
        path: '/workspace/process/instance/tabs',
        query: {
          processInstanceId: row.processInstanceId,
          taskId: row.taskId,
        }
      })
    },
  },
  mounted() {
    this.getSubmitedTaskList()
  }
}

</script>
